import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import { PlayTwo, DocumentFolder, Theme, SettingTwo } from '@icon-park/vue-next';
import Layout from '../views/layout/index.vue'

const routes: Array<RouteRecordRaw> = [
    {
        path: '/',
        name: 'home',
        redirect: '/play',
        meta: { level: 1, hidden: true },
        component: Layout,
        children: [
            {
                path: '/play',
                name: 'Player',
                redirect: '/play/home',
                meta: { level: 2, icon: PlayTwo, hidden: false },
                component: () => import("../views/player/index.vue"),
                children: [
                    {
                        path: '/play/home',
                        name: 'Player Home',
                        meta: { level: 3, hidden: true },
                        component: () => import("../views/player/home/index.vue"),
                    },
                    {
                        path: '/play/video/:id',
                        name: 'Video Player',
                        meta: { level: 3, hidden: true },
                        component: () => import("../views/player/video/index.vue"),
                    },
                    {
                        path: '/play/audio/:id',
                        name: 'Audio Player',
                        meta: { level: 3, hidden: true },
                        component: () => import("../views/player/audio/index.vue"),
                    },
                    {
                        path: '/play/picture/:id',
                        name: 'Picture Player',
                        meta: { level: 3, hidden: true },
                        component: () => import("../views/player/picture/index.vue"),
                    },
                    {
                        path: '/play/text/:id',
                        name: 'Text Player',
                        meta: { level: 3, hidden: true },
                        component: () => import("../views/player/text/index.vue"),
                    }
                ]
            },
            {
                path: '/lib',
                name: 'Library',
                meta: { level: 2, icon: DocumentFolder, hidden: false },
                component: () => import("../views/library/index.vue"),
            }
        ]
    },
    {
        path: '/setting',
        name: 'Settings',
        redirect: '/setting/main',
        meta: { level: 1, hidden: true },
        component: Layout,
        children: [
            {
                path: '/setting/skin',
                name: 'Skin',
                meta: { level: 2, icon: Theme, hidden: false },
                component: () => import("../views/player/index.vue"),
            },
            {
                path: '/setting/main',
                name: 'Setting',
                meta: { level: 2, icon: SettingTwo, hidden: false },
                component: () => import("../views/player/index.vue"),
            }
        ]
    },
]

const router = createRouter({
    history: createWebHistory(),
    routes: routes,
});

export default router